@import "../../../wap_common/static/libs/base/root.less";

.body-layout{
  background: @yellow1;
}

.page-gift{
  min-height: 100%;
   .types{
     background: @green;
     margin-bottom:20px;
     .type-tab{
       width: 50%;
       height: 50px;
       float: left;
       box-sizing: border-box;
       text-align: center;
       line-height: 50px;
       position: relative;
       color:#fff;
       .triangle-down{
         display: none;
         border-top-color:@green;
       }
     }
     .type-tab:nth-child(1){
       border-right:1px solid #d0c4a6;
     }
     .active{
       .triangle-down{
         display: block;
       }
     }
   }

  .explain{
    height: 30px;
    line-height: 30px;
    padding:0 20px;
    .share{
      float: left;
      color:@red;
    }
    .text{
      padding-left:20px;
      float: right;
      background: url(./image/info.png) no-repeat left center;
      background-size:14px 14px;
    }
  }

  .gift-list{
    padding: 20px 20px 0 20px;
    min-height: 50px;
    .gift-container{
      li{
        box-sizing: border-box;
        margin-bottom:20px;
        border:1px solid #a1a1a1;
        border-radius: 5px ;
        padding:10px 0;
        background: #dcdcdc;
        color: #676767;
        position: relative;
        .gift-item{
          height: 80px;
          position: relative;
          overflow: hidden;
          .left{
            position: absolute;
            left:0;
            top:0;
            height: 80px;
            width: 100px;
            border-right:1px dashed #676767;
            text-align: center;
            line-height: 80px;
            font-size:15px;
            .number{
              font-size:25px;
              font-weight: 700;
            }
          }
          .right{
            float: left;
            margin-left:110px;
            line-height: 20px;
            .status{
              font-size:15px;
              margin-bottom:5px;
              font-weight: 700;
            }
            .time{
              font-size:13px;
            }
            .rule{
              font-size:12px;
            }
          }
        }

        .new{
          width:39px;
          height: 24px;
          display: block;
          background: url(./image/new-tip.png) no-repeat center center;
          background-size:39px 24px;
          position: absolute;
          left:10px;
          top:-15px;
        }
      }

      .active{
        background: #fff;
        border:1px solid @yellow3;
        .gift-item{
          .left{
            color: @yellow3;
          }
          .right{
            .status{
              color: @yellow3;
            }
          }
        }
      }
    }
  }
}